<template>
	<view>
		<view class="tab-header-view">
			<u-tabs :list="list1" :activeStyle="{color: '#ffffff',fontWeight: 'bold',transform: 'scale(1.05)'}"
				:inactiveStyle="{color: '#ffffff',transform: 'scale(1)'}" lineColor="#ffffff"></u-tabs>
		</view>
		<!-- 列表 -->
		<view class="padding-30">
			<view class="bg-fff flex-between padding-30 border-radius10 margin-top20">
				<view class="fontSize-18 color-000 fontWeight-bold">
					SX5874
				</view>
				<view class="fontSize-14 color-EE6100">复制</view>
			</view>
			<view class="bg-fff flex-between padding-30 border-radius10 margin-top20">
				<view class="fontSize-18 color-000 fontWeight-bold">
					SX5874
				</view>
				<view class="fontSize-14 color-EE6100" @click="show = true">查看使用</view>
			</view>
		</view>

		<!-- 弹窗 -->
		<u-popup :show="show" mode="center" :round="20" bgColor="#FFFBF8">
			<view class="code-popup-view">
				<view class="flex-between">
					<view class="">
						<view class="fontSize-18 color-000 margin-bottom10 fontWeight-bold">安安</view>
						<view class="fontSize-13 color-666 margin-bottom10">
							<text>男</text>
							<text>35~44岁</text>
						</view>
						<view class="fontSize-13 color-666">
							技术工程师
						</view>
					</view>
					<view class="popup-right-view">
						<view class="fontSize-13 color-999 margin-bottom10">Xes12874&1</view>
						<view class="fontSize-13 color-999">已失效</view>
					</view>
				</view>
				<view class="flex-center margin-top50">
					<view class="popup-check-btn1 flex-center"
					@click="show = false">取消查看</view>
					<view class="popup-check-btn flex-center">查看测评报告</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list1: [{
					name: '未使用',
				}, {
					name: '已使用',
				}],
				show: false
			}
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.popup-check-btn1{
		width: 200rpx;
		padding: 20rpx;
		border-radius: 10rpx;
		background-color: #f2f2f2;
		font-size: 15px;
		color: #999999;
		margin-right: 50rpx;
	}
	.popup-check-btn{
		width: 200rpx;
		padding: 20rpx;
		border-radius: 10rpx;
		background-color: #EE6100;
		font-size: 15px;
		color: #ffffff;
	}
	.popup-right-view{
		background-color: #F2F2F2;
		border-radius: 10rpx;
		padding: 20rpx;
	}
	.code-popup-view {
		width: 600rpx;
		padding: 30rpx;
		border-radius: 30rpx 30rpx 0 0;
		// background: linear-gradient(122deg, #FFE8DB 20%, #FFFFFF 100%);
		background-color: #ffffff;
	}

	.tab-header-view {
		background-color: #EE6100;
	}
</style>